<!--
 * @Author: 睡衣船长 121771372@qq.com
 * @Date: 2023-10-13 18:04:40
 * @LastEditors: 睡衣船长 121771372@qq.com
 * @LastEditTime: 2023-11-02 14:29:25
 * @Description:
-->

<template>
  <div class="create-task">
    <xr-dialog
      ref="createTaskRef"
      v-bind="dialogParams"
      v-model="dialogVisible"
      @confirmClick="doCreateTask"
    >
      <template #body>
        <div class="detailContent">
          <!-- <div
            class="parentTaskTitle"
            v-if="parentTaskId"
          >
            {{ taskDetail.taskName }}
          </div> -->
          <div class="taskTitle">
            <!-- <xr-input
              placeholder="输入任务名称以新建任务"
              :maxlength="20"
              v-model="taskParams.taskName"
            ></xr-input> -->
          </div>
          <div class="formItem flex-left-center">
            <div class="label">持续时长<span class="required">*</span></div>
            <div class="itemValue taskDay">
              <!-- <xr-input
                placeholder="请输入持续时长"
                type="number"
                :max="999"
                :min="1"
                v-model="taskParams.taskDay"
              ></xr-input> -->
            </div>
          </div>
          <div class="formItem flex-left-center">
            <div class="label">任务部门<span class="required">*</span></div>
            <div class="itemValue">
              <!-- <xr-cascader
                v-model="orgIdsList"
                placeholder="选择任务部门"
                :options="orgList"
                @change="onOrgChange"
                :props="orgProps"
              >
              </xr-cascader> -->
            </div>
          </div>
          <div class="formItem flex-left-center" v-if="!props.isTemplate">
            <div class="label">执行人<span class="required">*</span></div>
            <div class="itemValue">
              <!-- <xr-select
                ref="executorRef"
                :requestFun="getUserList"
                placeholder="请选择执行人"
                v-model="taskParams.executorId"
              ></xr-select> -->
            </div>
          </div>
        </div>
      </template>
    </xr-dialog>
  </div>
</template>

<script lang="ts" setup>
import { computed, reactive, ref, nextTick, inject } from "vue";
// import { useOrgStore } from "@/pinia/org";
// import { fetchOrgUserList } from "@/api/departmentManage/orgUser";
import { _canObject, _deepClone } from "../utils/utils";
// import { apiCreateTemplateTask, apiCreateTask } from "@/api/raiseShop/task";

import xrDialog from "./dialog.vue";
const props = defineProps({
  isTemplate: {
    type: Boolean,
    default: true,
  },
  parentTask: {
    type: Object,
  },
  fromTask: {
    type: Object,
  },
});

const projectDetail: any = inject("projectDetail", ref()); // 项目详情

const taskParams = reactive({
  taskName: "",
  taskDay: "1",
  organizationId: "",
  organizationType: "",
  executorId: "",
});

const dialogParams = computed(() => {
  return {
    title: "创建任务",
    centerStyle: "padding:10px 20px;",
    contentStyle: "width:800px;",
    showFooter: true,
    cantConfirm: props.isTemplate
      ? !(taskParams.taskName && taskParams.organizationId)
      : !(
          taskParams.taskName &&
          taskParams.organizationId &&
          taskParams.executorId
        ),
  };
});

const dialogVisible = ref(false);

const orgIdsList = ref([]);

const orgList = ref([]);

const getUserList = async () => {
  if (taskParams.organizationId == "-1") {
    return [
      {
        value: projectDetail.value.store.id,
        label: projectDetail.value.store.storeName,
      },
    ];
  }
  if (taskParams.organizationId == "-2") {
    return [
      {
        value: projectDetail.value.store.id,
        label: projectDetail.value.store.storeName,
      },
    ];
  }
  if (!taskParams.organizationId) return [];
  const res: any = await fetchOrgUserList({ orgId: taskParams.organizationId });
  console.log(res, "getUserList");
  if (!_canObject(res) && !res?.length) return [];
  const userList = res.map((tableUserItem: any) => {
    return {
      label: tableUserItem.user.nickName,
      value: tableUserItem.user.id + "",
    };
  });
  console.log(userList, "userList");
  return Promise.resolve(userList);
};

const executorRef = ref();

const onOrgChange = () => {
  taskParams.organizationId =
    orgIdsList.value[orgIdsList.value.length - 1] || "";
  if (taskParams.organizationId == "-1") {
    taskParams.organizationType = "3";
  } else if (taskParams.organizationId == "-2") {
    taskParams.organizationType = "4";
  } else {
    taskParams.organizationType = "2";
  }
  taskParams.executorId = "";
  // getUserList()
  if (!props.isTemplate) executorRef.value.getOptionList();
  console.log(orgIdsList.value, "选择部门变化", taskParams);
};

const orgProps = {
  checkStrictly: true,
  children: "subOrgList",
  label: "orgName",
  value: "id",
};

const refreshOrgList = async () => {
  // const res = await useOrgStore().getOrgList();
  // orgList.value = _deepClone(res);
  // // if (projectDetail.value) {
  // orgList.value.unshift({
  //   orgName: "门店",
  //   orgType: 3,
  //   id: -1,
  // });
  // orgList.value.unshift({
  //   orgName: "施工队",
  //   orgType: 4,
  //   id: -2,
  // });
  // }
};

nextTick(async () => {
  // await refreshOrgList()
});

const show = async () => {
  // await refreshOrgList();
  // taskParams.taskName = "";
  // taskParams.taskDay = "1";
  // taskParams.organizationId = "";
  // taskParams.organizationType = "";
  // taskParams.executorId = "";
  // orgIdsList.value = [];

  dialogVisible.value = true;
  console.log("show", dialogVisible.value);
};

const doCreateTask = async () => {
  // console.log(props.parentTask, "parentTask");
  // const _taskParams = props.parentTask?.id
  //   ? {
  //       parentId: props.parentTask.id,
  //     }
  //   : {
  //       parentId: 0,
  //       fromTaskId: props.fromTask?.id,
  //     };
  // const _task = props.parentTask?.id ? props.parentTask : props.fromTask;
  // if (taskParams.organizationId == "-1" || taskParams.organizationId == "-2") {
  //   taskParams.organizationId = taskParams.executorId;
  // }
  // props.isTemplate
  //   ? await apiCreateTemplateTask({
  //       templateId: _task.templateId,
  //       taskSource: _task.taskSource,
  //       ..._taskParams,
  //       ...taskParams,
  //     })
  //   : await apiCreateTask({
  //       taskSource: _task.taskSource,
  //       prepareStoreId: _task.prepareStoreId,
  //       ..._taskParams,
  //       ...taskParams,
  //     });
  // emit("confirmClick");
};

const emit = defineEmits<{
  /* eslint-disable */
  (e: "confirmClick"): void;
  /* eslint-enable */
}>();

defineExpose({ show });
</script>

<style lang="scss" scoped>
// @import "../../../../styles/xr-theme.scss";

.detailContent {
  .parentTaskTitle {
    display: inline-block;
    line-height: 30px;
    padding: 0 8px;
    border-radius: 6px;
    color: #f5f8fa;
    font-size: 14px;
    color: #7e8299;
    background: #f5f8fa;
  }

  .taskTitle {
    margin-bottom: 30px;

    :deep(.el-input__wrapper) {
      height: 16px;
      line-height: 16px;
      margin-top: 16px;
      font-size: 20px;
      color: #a1a5b7;
      background: #fff;
    }
  }

  .formItem {
    margin-bottom: 16px;

    .label {
      font-size: 14px;
      color: #3f4254;
      width: 120px;
      margin-right: 16px;

      .required {
        margin-left: 2px;
        color: #f1416c;
      }
    }

    .itemValue {
      width: 224px;

      &.taskDay {
        width: 144px;
      }
    }
  }
}
</style>
